import {
    createStore
} from 'vuex'
import {
    localGet
} from "@/utils";
import axios from "@/utils/axios";

const store = createStore({
    state: {
        vuexText: '我在vuex里面，当前位置是首页',
        token: localGet("token"), //登录token
        userInfo: localGet("userInfo"), //用户信息
        isCollapse: false, //左侧菜单收缩
        memuList: {}, //左侧菜单列表
    },
    // 获取状态(变量的值)
    getters: {},
    //修改state里面的变量(修改变量的值)
    mutations: {
        setVuexText(state, newValue) { //可换掉（测试用的）
            state.vuexText = newValue
        },
        setToken(state, newValue) {
            state.token = newValue
        },
        setUserInfo(state, newValue) {
            state.userInfo = newValue
        },
        setMemuList(state, newValue) {
            state.memuList = newValue
        },
        setIsCollapse(state, newValue) {
            state.isCollapse = newValue
        },
    },
    // Action异步方法 触发 mutation 函数,从而修改状态(该方法需要通过dispatch()调用:store.dispatch("xx", 888);)
    actions: {
        asyncSetIsCollapse(context) { // 该方法需要通过dispatch()调用
            context.commit("setIsCollapse", !store.state.isCollapse) // 通过commit方法调用add
        },
        async asyncSetMemuList(context) { // 该方法需要通过dispatch()调用
            const res = await axios.get("/api/menu"); //动态获取左侧菜单
            context.commit("setMemuList", res.data) // 通过commit方法调用add
        }
    },
    // Module 当状态很多时,把状态分开来管理
    modules: {

    }
})

export default store